﻿<template>
  <baseConfigUI :config.sync="config" :events.sync="events">
    <el-row :gutter="20">
      <el-col :span="12">
        <el-form-item label = "按钮类型">
          <el-select v-model = 'config.other.type'>
              <el-option label = 'primary' value = 'primary'></el-option>
              <el-option label = 'success' value = 'success'></el-option>
              <el-option label = 'warning' value = 'warning'></el-option>
              <el-option label = 'danger' value = 'danger'></el-option>
              <el-option label = 'info' value = 'info'></el-option>
            </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item label = "按钮名称">
          <el-input v-model = "config.other.text"></el-input>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row :gutter="20">
      <el-col :span="8">
        <el-form-item label = "左侧图标">
          <el-input v-model = "config.other.leftIcon"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label = "右侧图标">
          <el-input v-model = "config.other.rightIcon"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label = "对齐方式">
          <el-select v-model = 'config.other.textAlign'>
            <el-option label = '左对齐' value = 'left'></el-option>
            <el-option label = '右对齐' value = 'right'></el-option>
            <el-option label = '居中' value = 'center'></el-option>
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="12">
        <el-form-item label = "是否有下划线">
          <el-switch v-model="config.other.underline"></el-switch>
        </el-form-item>
      </el-col>
    </el-row>
  </baseConfigUI>
</template>
<script>
import baseConfigUI from '../baseConfigUI.vue'
export default {
  components: {baseConfigUI},
  props: ['config', 'events'],
  data () {
    return {
    }
  }
}
</script>
